{include file="public_head" /}
<!-- chk_3 -->
<link href="__STATIC__/css/chk_3.css" rel="stylesheet" type="text/css"/>

<body class="nav-md">

<div class="container body">


    <div class="main_container">

        {include file="public_sidebar,public_nav" /}

        <!-- page content -->
        <div class="right_col" role="main">
            <div class="">
                <div class="page-title">
                    <div class="title_left">
                        <h3>
                            限时抢购商品管理
                        </h3>
                    </div>
                </div>
                <div class="clearfix"></div>

                <div class="row">

                    <div class="col-md-12 col-sm-12 col-xs-12">
                        <div class="x_panel">
                            <div class="x_title">
                                <h2>{$mate_title}</h2>
                            </div>
                            <div class="x_content">
                                <div class="row">
                                    <div class="col-md-12">
                                        <div class="x_panel">
                                            <div class="x_title">
                                                <h2>Transaction Summary <small>Weekly progress</small></h2>
                                                <div class="clearfix"></div>
                                            </div>
                                            <div class="x_content">
                                                <div class="col-md-9 col-sm-12 col-xs-12">
                                                    <div class="demo-container" style="height:280px">
                                                        <div id="placeholder33x" class="demo-placeholder"></div>
                                                    </div>
                                                    <!--<div class="tiles">-->
                                                        <!--<div class="col-md-4 tile">-->
                                                            <!--<span>Total Sessions</span>-->
                                                            <!--<h2>231,809</h2>-->
                                                            <!--<span class="sparkline11 graph" style="height: 160px;">-->
                                          <!--<canvas width="200" height="60" style="display: inline-block; vertical-align: top; width: 94px; height: 30px;"></canvas>-->
                                      <!--</span>-->
                                                        <!--</div>-->
                                                        <!--<div class="col-md-4 tile">-->
                                                            <!--<span>Total Revenue</span>-->
                                                            <!--<h2>$231,809</h2>-->
                                                            <!--<span class="sparkline22 graph" style="height: 160px;">-->
                                          <!--<canvas width="200" height="60" style="display: inline-block; vertical-align: top; width: 94px; height: 30px;"></canvas>-->
                                      <!--</span>-->
                                                        <!--</div>-->
                                                        <!--<div class="col-md-4 tile">-->
                                                            <!--<span>Total Sessions</span>-->
                                                            <!--<h2>231,809</h2>-->
                                                            <!--<span class="sparkline11 graph" style="height: 160px;">-->
                                          <!--<canvas width="200" height="60" style="display: inline-block; vertical-align: top; width: 94px; height: 30px;"></canvas>-->
                                      <!--</span>-->
                                                        <!--</div>-->
                                                    <!--</div>-->

                                                </div>

                                                <!--<div class="col-md-3 col-sm-12 col-xs-12">-->
                                                    <!--<div>-->
                                                        <!--<div class="x_title">-->
                                                            <!--<h2>Top Profiles</h2>-->
                                                            <!--<ul class="nav navbar-right panel_toolbox">-->
                                                                <!--<li><a class="collapse-link"><i class="fa fa-chevron-up"></i></a>-->
                                                                <!--</li>-->
                                                                <!--<li class="dropdown">-->
                                                                    <!--<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false"><i class="fa fa-wrench"></i></a>-->
                                                                    <!--<ul class="dropdown-menu" role="menu">-->
                                                                        <!--<li><a href="#">Settings 1</a>-->
                                                                        <!--</li>-->
                                                                        <!--<li><a href="#">Settings 2</a>-->
                                                                        <!--</li>-->
                                                                    <!--</ul>-->
                                                                <!--</li>-->
                                                                <!--<li><a class="close-link"><i class="fa fa-close"></i></a>-->
                                                                <!--</li>-->
                                                            <!--</ul>-->
                                                            <!--<div class="clearfix"></div>-->
                                                        <!--</div>-->
                                                        <!--<ul class="list-unstyled top_profiles scroll-view">-->
                                                            <!--<li class="media event">-->
                                                                <!--<a class="pull-left border-aero profile_thumb">-->
                                                                    <!--<i class="fa fa-user aero"></i>-->
                                                                <!--</a>-->
                                                                <!--<div class="media-body">-->
                                                                    <!--<a class="title" href="#">Ms. Mary Jane</a>-->
                                                                    <!--<p><strong>$2300. </strong> Agent Avarage Sales </p>-->
                                                                    <!--<p> <small>12 Sales Today</small>-->
                                                                    <!--</p>-->
                                                                <!--</div>-->
                                                            <!--</li>-->
                                                            <!--<li class="media event">-->
                                                                <!--<a class="pull-left border-green profile_thumb">-->
                                                                    <!--<i class="fa fa-user green"></i>-->
                                                                <!--</a>-->
                                                                <!--<div class="media-body">-->
                                                                    <!--<a class="title" href="#">Ms. Mary Jane</a>-->
                                                                    <!--<p><strong>$2300. </strong> Agent Avarage Sales </p>-->
                                                                    <!--<p> <small>12 Sales Today</small>-->
                                                                    <!--</p>-->
                                                                <!--</div>-->
                                                            <!--</li>-->
                                                            <!--<li class="media event">-->
                                                                <!--<a class="pull-left border-blue profile_thumb">-->
                                                                    <!--<i class="fa fa-user blue"></i>-->
                                                                <!--</a>-->
                                                                <!--<div class="media-body">-->
                                                                    <!--<a class="title" href="#">Ms. Mary Jane</a>-->
                                                                    <!--<p><strong>$2300. </strong> Agent Avarage Sales </p>-->
                                                                    <!--<p> <small>12 Sales Today</small>-->
                                                                    <!--</p>-->
                                                                <!--</div>-->
                                                            <!--</li>-->
                                                            <!--<li class="media event">-->
                                                                <!--<a class="pull-left border-aero profile_thumb">-->
                                                                    <!--<i class="fa fa-user aero"></i>-->
                                                                <!--</a>-->
                                                                <!--<div class="media-body">-->
                                                                    <!--<a class="title" href="#">Ms. Mary Jane</a>-->
                                                                    <!--<p><strong>$2300. </strong> Agent Avarage Sales </p>-->
                                                                    <!--<p> <small>12 Sales Today</small>-->
                                                                    <!--</p>-->
                                                                <!--</div>-->
                                                            <!--</li>-->
                                                            <!--<li class="media event">-->
                                                                <!--<a class="pull-left border-green profile_thumb">-->
                                                                    <!--<i class="fa fa-user green"></i>-->
                                                                <!--</a>-->
                                                                <!--<div class="media-body">-->
                                                                    <!--<a class="title" href="#">Ms. Mary Jane</a>-->
                                                                    <!--<p><strong>$2300. </strong> Agent Avarage Sales </p>-->
                                                                    <!--<p> <small>12 Sales Today</small>-->
                                                                    <!--</p>-->
                                                                <!--</div>-->
                                                            <!--</li>-->
                                                        <!--</ul>-->
                                                    <!--</div>-->
                                                <!--</div>-->

                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>
            </div>

        </div>
        <!-- /page content -->
    </div>

</div>

{include file="public_foot" /}
<!-- public -->
<script src="__STATIC__/js/public.js"></script>
<!-- layer -->
<script src="__STATIC__/js/layer.js"></script>
<!-- Flot -->
<script>
    $(document).ready(function() {
        //define chart clolors ( you maybe add more colors if you want or flot will add it automatic )
        var chartColours = ['#96CA59', '#3F97EB', '#72c380', '#6f7a8a', '#f7cb38', '#5a8022', '#2c7282'];

        //generate random number for charts
//        randNum = function() {
//            return 10;
//        };

        var d1 = [];


        {foreach name="data" id="item"}
        d1.push([{:strtotime($key)}*1000, {$item}]);
        {/foreach}

        var chartMinDate = d1[0][0]; //first day
        var chartMaxDate = d1[6][0]; //last day

        var tickSize = [1, "day"];
        var tformat = "%d/%m/%y";

        //graph options
        var options = {
            grid: {
                show: true,
                aboveData: true,
                color: "#3f3f3f",
                labelMargin: 10,
                axisMargin: 0,
                borderWidth: 0,
                borderColor: null,
                minBorderMargin: 5,
                clickable: true,
                hoverable: true,
                autoHighlight: true,
                mouseActiveRadius: 100
            },
            series: {
                lines: {
                    show: true,
                    fill: true,
                    lineWidth: 2,
                    steps: false
                },
                points: {
                    show: true,
                    radius: 4.5,
                    symbol: "circle",
                    lineWidth: 3.0
                }
            },
            legend: {
                position: "ne",
                margin: [0, -25],
                noColumns: 0,
                labelBoxBorderColor: null,
                labelFormatter: function(label, series) {
                    // just add some space to labes
                    return label + '&nbsp;&nbsp;';
                },
                width: 40,
                height: 1
            },
            colors: chartColours,
            shadowSize: 0,
            tooltip: true, //activate tooltip
            tooltipOpts: {
                content: "%s: %y.0",
                xDateFormat: "%d/%m",
                shifts: {
                    x: -30,
                    y: -50
                },
                defaultTheme: false
            },
            yaxis: {
                min: 0
            },
            xaxis: {
                mode: "time",
                minTickSize: tickSize,
                timeformat: tformat,
                min: chartMinDate,
                max: chartMaxDate
            }
        };
        var plot = $.plot($("#placeholder33x"), [{
            label: "Email Sent",
            data: d1,
            lines: {
                fillColor: "rgba(150, 202, 89, 0.12)"
            }, //#96CA59 rgba(150, 202, 89, 0.42)
            points: {
                fillColor: "#fff"
            }
        }], options);
    });
</script>
<!-- /Flot -->